﻿@model IEnumerable<TruckingApplication.Dal.EntityModels.ALERT>

@{
    ViewBag.Title = "Alerts";
}


<script type="text/javascript">
    function openThis(val) {
        var id = '#emailSubject_' + val;
        var div = $(id);
        div.css('display', 'block');
    }

    function closeSubject(val) {
        var div = $('#emailSubject_' + val);
        div.css('display', 'none');

        // Update collection on server set Read = true
        $.ajax({
            type: 'POST',
            url: '../Account/MarkEmailRead',
            data: { Id: val }
        });

        // Update UI set Read = true
        handleCheckboxes(val, 'True');
    }

    function handleCheckboxes(val, isChecked) {
        var isRead = false;
        if (isChecked != 'False')
            isRead = true;

        var chkBox = $('#chkBox_' + val + '_read');
        var elemName = 'chkBox_' + val + '_read';
        $('input[name=' + elemName + ']').attr('checked', isRead);
    }
</script>

<br /><h2>Alerts</h2>

<table id="tableMgmt" class="display" style="max-width:99%;">
	<thead>
    <tr>
        <th style="width:60%; text-align:left; vertical-align:top;">
            Subject
        </th>
        <th style="width:25%; text-align:left; vertical-align:top;">
            Date
        </th>
        <th style="width:15%; text-align:left; vertical-align:top;">
            Read
        </th>
    </tr>
	</thead>
	<tbody>
@foreach (var item in Model)
{
    <tr>
        <td>
            @{
    var sub = item.subject;    
            }
            
            <a href="#" onclick="openThis('@item.alert_Id.ToString()'); return false;">@sub</a>
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.date)
        </td>
        <td>
            <input type="checkbox"  id="chkBox_@(item.alert_Id)_read" name="chkBox_@(item.alert_Id)_read" disabled="disabled" />
            <script type="text/javascript">
                handleCheckboxes('@(item.alert_Id)', '@(item.read)');
            </script>
            &nbsp;&nbsp;&nbsp;&nbsp;
        </td>
    </tr>
    <tr>
        <td colspan="3">
            <div id="emailSubject_@(item.alert_Id)" style="display:none;">
                <a href="#" style="float:right;" onclick="closeSubject('@item.alert_Id'); return false;">Close</a>
                <br /><br />
                @Html.Raw(@item.content)
                
            </div>
        </td>
    </tr>
}
	</tbody>
	<tfoot>
    <tr>
        <th>
            date
        </th>
        <th>

            subject
        </th>
        <th>
            read
        </th>
    </tr>
	</tfoot>
</table>
